import React, {Component}      from 'react';
import {
    StyleSheet,
    View,
    Image,
    Dimensions,
    Text,
    TouchableOpacity
}from 'react-native';
import BaseNavigationBar        from '../../views/BaseNavigationBar';
import ListItemDivider          from '../../views/ListItemDivider.js';
import  ItemCell                from '../../views/ItemCell';
import  LeftItemCell            from '../../views/LeftItemCell';
import Toast, {DURATION}        from 'react-native-easy-toast';
const {width} = Dimensions.get('window');

export default class AboutScreen extends Component {

    popToBack(){
        this.props.navigation.goBack()
    }

    goCall(){
        this.refs.toast.show('开发中！！！');
    }

    goContactUs(){
        this.refs.toast.show('开发中！！！');
    }

    render() {
        return (
            <View style={styles.container}>
                <BaseNavigationBar
                    title={'关于我们'}
                    leftImageSource={require('../../../images/other/ic_back.png')}
                    leftItemFunc={() => this.popToBack()}/>

                <View style={styles.logoViewStyle}>
                    <Image
                        style={styles.logoStyle}
                        source={require('../../../images/login/ic_logo.png')}
                    />
                    <Text style={styles.titleStyle}>一个能赚钱的荷包</Text>
                </View>

                <View style={{width:width,height:width/6}}/>

                <TouchableOpacity activeOpacity={1} onPress={this.goCall.bind(this)}>
                    <LeftItemCell title='客服电话' arrowImage={require('../../../images/other/arrow.png')}/>
                </TouchableOpacity>

                <ListItemDivider/>
                <TouchableOpacity activeOpacity={1} onPress={this.goContactUs.bind(this)}>
                    <LeftItemCell title='关注我们'  arrowImage={require('../../../images/other/arrow.png')}/>
                </TouchableOpacity>

                <Toast ref="toast" position='center'/>

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor:'#f0f0f0'
    },
    logoViewStyle:{
        marginTop:width/10,
        justifyContent:'center',
        alignItems:'center'
    },
    logoStyle:{
        height:width/6,
        width:width/6
    },
    titleStyle:{
        fontSize:14,
        color:'#909090',
        textAlign:'center',
        marginTop:10
    }
});
